<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0" />
    <title>Pick一下，准备出发！</title>
    <link rel="stylesheet" href="./css/main.css">
    <script src="//p1.ifengimg.com/auto/js/2017/1109/jquery-3.2.1.min.js"></script>
    <script src="./js/data.js"></script>
</head>
<body>
<!--proress-->
<!--<div class="proess">-->
    <!--<p class="progress">0%</p>-->
<!--</div>-->
<!--startbtn-->
<div class="scene-start">
        <div class="start-btn">
        </div>
</div>
<div class="scene-con">
     <div class="scene-room">
        <div class="person">
            <div class="top body-common"><img src="./img/person/3.png" alt=""></div>
            <div class="middle body-common"><img src="./img/person/2.png" alt=""></div>
            <div class="bottom body-common"><img src="./img/person/1.png" alt=""></div>
        </div>
     </div>
    <div class="scene-tool">
        <div class="tool-tab-arrow"></div>
        <div class="scene-tool-tab clearfix">
            <div class="tool-nav-option "></div>
            <div class="tool-nav-option"></div>
            <div class="tool-nav-option"></div>
            <div class="tool-nav-option"></div>
        </div>
        <div class="tool-option-cons">
            <div class="tool-option-con tool-option-person ">
                      <ul class="person-icon clearfix">
                           <li></li>
                           <li></li>
                      </ul>
                <div class="person-set">
                    <ul class="set-nav clearfix">
                        <li >头发</li>
                        <li>上装</li>
                        <li>夏装</li>
                        <li>装饰</li>
                    </ul>
                    <div class="set-con">
                        <div class="man-set common-set">
                            <div class="man-set-con"></div>
                            <div class="man-set-con"></div>
                            <div class="man-set-con"></div>
                            <div class="man-set-con"></div>
                        </div>
                        <div class="woman-set common-set">
                           <div class="woman-set-con common-set-con ">
                               <ul class="clearfix">
                                   <li><img src="./img/person/woman/hair/1.png" alt=""></li>
                                   <li><img src="./img/person/woman/hair/2.png" alt=""></li>
                                   <li><img src="./img/person/woman/hair/3.png" alt=""></li>
                                   <li><img src="./img/person/woman/hair/4.png" alt=""></li>
                               </ul>
                           </div>
                            <div class="woman-set-con common-set-con">  <ul class="clearfix">
                                <li><img src="./img/person/woman/upDress/1.png" alt=""></li>
                                <li><img src="./img/person/woman/upDress/2.png" alt=""></li>
                                <li><img src="./img/person/woman/upDress/3.png" alt=""></li>
                                <li><img src="./img/person/woman/upDress/4.png" alt=""></li>
                            </ul></div>
                            <div class="woman-set-con common-set-con">  <ul class="clearfix">
                                <li><img src="./img/person/woman/downDress/1.png" alt=""></li>
                                <li><img src="./img/person/woman/downDress/2.png" alt=""></li>
                                <li><img src="./img/person/woman/downDress/3.png" alt=""></li>
                                <li><img src="./img/person/woman/downDress/4.png" alt=""></li>
                            </ul></div>
                            <div class="woman-set-con common-set-con">  <ul class="clearfix">
                                <li><img src="./img/person/woman/fashion/1.png" alt=""></li>
                                <li><img src="./img/person/woman/fashion/2.png" alt=""></li>
                                <li><img src="./img/person/woman/fashion/3.png" alt=""></li>
                                <li><img src="./img/person/woman/fashion/4.png" alt=""></li>
                            </ul></div>
                        </div>
                    </div>
                </div>
             </div>
            <div class="tool-option-con tool-option-style">
                <ul>
                    <li><img src="./img/car/1.png" alt=""></li>
                    <li><img src="./img/car/2.png" alt=""></li>
                    <li><img src="./img/car/3.png" alt=""></li>
                    <li><img src="./img/car/4.png" alt=""></li>
                </ul>
            </div>
            <div class="tool-option-con tool-option-style">
                <ul>
                    <li><img src="./img/decorate/1.png" alt=""></li>
                    <li><img src="./img/decorate/2.png" alt=""></li>
                    <li><img src="./img/decorate/3.png" alt=""></li>
                    <li><img src="./img/decorate/4.png" alt=""></li>
                </ul>
            </div>
            <div class="tool-option-con tool-option-style">
                <ul>
                    <li><img src="./img/bg/1.jpg" alt=""></li>
                    <li><img src="./img/bg/2.jpg" alt=""></li>
                    <li><img src="./img/bg/3.jpg" alt=""></li>
                    <li><img src="./img/bg/4.jpg" alt=""></li>
                </ul>
            </div>
        </div>
    </div>
</div>
<script src="./js/main.js"></script>
</body>
</html>